<template>
	<view>
		<!-- <u-navbar :is-back='false' :border-bottom='false' title='资讯列表' title-color='#ffffff' :is-fixed='true' :background='background'>
			<view class="slot-wrap">
				<view @click="back" style="border-radius: 50%;width: 50rpx;height: 50rpx;background-color:rgba(0,0,0,.2);position: relative;">
					<text class="iconfont icon-xiangzuo" style="font-size: 40rpx;color: #FFFFFF;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);"></text>
				</view>

			</view>
		</u-navbar> -->
		<view style="width: 750rpx;height: 366rpx;background: linear-gradient(180deg, #1fb0ac 0%, #F5F5F5 100%);position: relative;padding-top: 80rpx;">
			<view style="position: fixed;top: 0;left: 0;z-index: 100;width: 100%;background: linear-gradient(180deg, #1fb0ac 0%, #6FB1FA 100%);">
				<view style="width: 92%;color: rgba(255,255,255,.8);overflow: hidden;line-height: 50rpx;font-size: 30rpx;margin: 0 auto;">
					<scroll-view id="tab-bar" class="scroll-h" :scroll-x="true" :show-scrollbar="false" :scroll-into-view="scrollInto">
							<view v-for="(tab,index) in ti_list" :key="tab.id" class="uni-tab-item" :id="tab.ids" :data-current="index" @click="ontabtap(index,tab.id)">
								<text class="uni-tab-item-title" :class="tabIndex==index ? 'uni-tab-item-title-active' : ''">{{tab.title}}</text>
								<image v-if="tabIndex==index" src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230411/2176b3fec852179c4610f402fdac0589.png" style="width: 100rpx;height: 12rpx;position: absolute;left: 50%;bottom: 16rpx;transform: translateX(-50%);"  mode=""></image>
							</view>
					</scroll-view>
				</view>
			</view>
			<view style="width: 92%;box-sizing: border-box;background-color: #ffffff;border-radius:16rpx 16rpx 0 0 ;margin: 0 auto;">
				<view @click="xq(item.id)" v-for="(item,index) in list" :key='index' style="border-bottom: 1px solid #EEEEEE;padding: 30rpx 30rpx;">
					<!-- <view style="color: #000000;font-size: 30rpx;line-height: 80rpx;font-weight: 600;" class="yihang">
						{{item.title}}
					</view> -->
					<view style="overflow: hidden;">
						<view style="width: 60%;float: left;">
							<view style="color: #000000;font-size: 30rpx;line-height: 40rpx;font-weight: 600;position: relative;" class="sanhang">

								{{item.title}}

							</view>
							<view v-if="item.summary" style="line-height: 40rpx;color: #666666;font-size: 24rpx;margin: 10rpx 0;" class="erhang">
								{{item.summary}}
							</view>
							<view v-if="item.is_vip!=1" style="line-height: 40rpx;color: #666666;font-size: 24rpx;margin-top: 10rpx;">
								价格:<text style="color: red;">{{item.user_price}}</text>
								<text style="margin-left: 20rpx;"></text>
								会员价:<text style="color: red;">{{item.vip_price}}</text>
							</view>
							<view style="margin-top: 20rpx;line-height: 30rpx;">
								<text style="margin-right: 30rpx;float: left;font-size: 24rpx;color: #1fb0ac;">[{{item.category.title}}]</text>
								<!-- <image src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/liulan.png" style="width: 30rpx;height: 30rpx;float: left;display: block;"  mode=""></image><text style="color: #999999;font-size: 22rpx;float: left;line-height: 30rpx;">{{item.pv}}</text> -->
								<text style="color: #999999;font-size: 22rpx;float: right;line-height: 30rpx;">{{item.show_time | getLocalTime}}</text>
								<image src="https://qiniuoss.yjqwl.cn/uploads/20220314/FlrzBNR4GCGHDgjnkg0QKCYv5KRP.png" style="width: 26rpx;height: 26rpx;float: right;display: block;margin-right: 8rpx;margin-top: 2rpx;"  mode=""></image>
							</view>
						</view>
						<view style="width: 40%;float: right;">
							<image :src="item.image" style="width:220rpx;height: 176rpx;border-radius: 14rpx;float: right;display: block;" mode=""></image>
						</view>
					</view>
				</view>

			</view>
		</view>

		<!-- <image src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/kefu.png" style="width: 80rpx;height: 80rpx;position: fixed;right: 0;bottom: 300rpx;" mode=""></image> -->
		<image @click="gundong" v-if="da" src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/up.png" style="width: 80rpx;height: 80rpx;position: fixed;right: 0;bottom: 200rpx;" mode=""></image>


		<uni-popup id="popup" ref="popup" :type="type" :animation="true">
			<view class="" style="background-color: #FFFFFF;padding:20upx 30upx 0;border-radius: 20upx;width: 500rpx;">
				<view style="text-align: center;height: 100upx;line-height: 100upx;color: #333333;font-weight: 600;font-size: 32rpx;">
					提示
				</view>
				<view class="popup-content" style="text-align: center;font-size: 28upx;">请授权您的用户信息</view>
				<view class="footer">
					<button @click="quxiao" style="flex: 1;background-color: #f3f3f3;color: #333333;margin-right: 20rpx;font-weight: 600;"
					 type="default">取消</button>
					<button @click="login" lang="zh_CN" style="flex: 1;background-color: #000000;color: #FFFFFF;" open-type="getUserInfo">确定</button>
					<!-- <button @click="submitLink" type="default" class="submit">确认提交</button> -->
				</view>
			</view>
		</uni-popup>
		<uni-popup id="popup" ref="popup1" :type="type" :animation="true">
			<view class="" style="background-color: #FFFFFF;padding:20upx 30upx 0;border-radius: 20upx;width: 500rpx;">
				<view
					style="text-align: center;height: 100upx;line-height: 100upx;color: #333333;font-weight: 600;font-size: 32rpx;">
					提示
				</view>
				<view class="popup-content" style="text-align: center;font-size: 28upx;">请授权您的手机号</view>
				<view class="footer">
					<button @click="quxiao1"
						style="flex: 1;background-color: #f3f3f3;color: #333333;margin-right: 20rpx;font-weight: 600;"
						type="default">取消</button>
					<button @getphonenumber="login1" style="flex: 1;background-color: #000000;color: #FFFFFF;"
						open-type="getPhoneNumber">确定</button>

				</view>
			</view>
		</uni-popup>

		<uni-popup id="popup" ref="popup2" :type="type" :animation="true">
			<!-- <view class="" style="background-color: #FFFFFF;padding:20upx 30upx;border-radius: 20upx;width: 600rpx;">
				<view style="text-align: center;height: 100upx;line-height: 100upx;color: #333333;font-weight: 600;font-size: 32rpx;">
					选择付费
				</view>
				<view style="text-align: center;line-height: 60rpx;color: #333333;font-size: 28rpx;">
					加入会员或单次付费当前资讯查看
				</view>
					<view style="display: flex;line-height: 60rpx;text-align: center;" v-for="(item,index) in zf1_list" :key='index'>
						<view @click="ff(index)" style="flex: 2;">
							<image  :src="index+1==ff_status?xz:wxz"  style="width: 30rpx;height: 30rpx;" mode=""></image>
						</view>
						<view style="flex:3;text-align: left;">
							{{item}}
						</view>
					</view>

				<view class="" style="display: flex;margin-top: 30rpx;">
					<view @click="quxiao2" style="margin-right:20rpx;flex:1;height: 80rpx;line-height: 80rpx;background-color: #C0C0C0;border-radius: 40rpx;color: #FFFFFF;font-size: 30rpx;text-align: center;">
						取消
					</view>
					<view @click="guanbi2" style="flex:1;height: 80rpx;line-height: 80rpx;background-color: #1fb0ac;border-radius: 40rpx;color: #FFFFFF;font-size: 30rpx;text-align: center;">
						确定
					</view>
				</view>
			</view> -->
			<view class="" style="padding:20upx 30upx 0;border-radius: 20upx;width: 640rpx;height: 600rpx;position: relative;">
				<image src="https://qiniuoss.yjqwl.cn/uploads/20211203/Fng6fsTdaGgv1PZ2eurMf6KF3AXj.png" style="width: 640rpx;height: 480rpx;position: absolute;top: 0;left: 0;"  mode=""></image>
				<!-- <view style="width: 90%;text-align: center;height: 100upx;line-height: 100upx;color: #333333;font-weight: 600;font-size: 32rpx;position: absolute;top: 70rpx;left: 50%;transform: translateX(-50%);text-align: center;">
					选择付费
				</view> -->
				<view v-if="iosUpAppStore" style="width: 90%;line-height: 40rpx;color: #333333;font-size: 28rpx;position: absolute;top: 100rpx;left: 50%;transform: translateX(-50%);text-align: center;">
					{{dancifu.money}}元/次(或{{dancifu.read_score}}积分/次)查看本文详情</br>
					开通会员可查看所有资讯详情</br>
					会员价:<text v-for="(item,index) in listqian" :key='index'><text style="color: red;font-size: 30rpx;">{{item.money}}元</text>/{{item.year}}年 <text v-if="listqian.length!=index+1">、</text></text>
				</view>
				<view style="position: absolute;top: 230rpx;left: 50%;transform: translateX(-50%);width: 90%;">
					<view @click="ff(index)" style="display: flex;line-height: 60rpx;text-align: center;text-align: center;" v-for="(item,index) in zf1_list" :key='index'>
						<view  style="flex: 2;">
							<image  :src="index+1==ff_status?xz1:wxz1"  style="width: 30rpx;height: 30rpx;" mode=""></image>
						</view>
						<view style="flex:3;text-align: left;">
							{{item}}
						</view>
					</view>
				</view>


				<view class="" style="display: flex;margin-top: 30rpx;position: absolute;top: 330rpx;left: 50%;transform: translateX(-50%);text-align: center;width: 90%;">
					<view @click="quxiao2" style="margin-right:20rpx;flex:1;height: 76rpx;line-height: 76rpx;border-radius: 40rpx;color: #E6A06C;font-size: 30rpx;text-align: center;border: 1px solid #E6A06C;">
						取消
					</view>
					<view @click="guanbi2" style="flex:1;height: 80rpx;line-height: 80rpx;background-color: #ECBD5C;border-radius: 40rpx;color: #FFFFFF;font-size: 30rpx;text-align: center;">
						确定
					</view>
				</view>
			</view>
		</uni-popup>


		<uni-popup id="popup" ref="popup3" :type="type" :animation="true">
			<view class="" style="background-color: #FFFFFF;padding:20upx 30upx;border-radius: 20upx;width: 600rpx;">
				<view style="text-align: center;height: 100upx;line-height: 100upx;color: #333333;font-weight: 600;font-size: 32rpx;">
					选择支付方式
				</view>
					<view @click="zffs(index)" style="display: flex;line-height: 60rpx;text-align: center;" v-for="(item,index) in zf_list" :key='index'>
						<view  style="flex: 2;">
							<image  :src="index+1==zf_status?xz:wxz"  style="width: 30rpx;height: 30rpx;" mode=""></image>
						</view>
						<view style="flex:3;text-align: left;">
							{{item}}
						</view>
					</view>

				<view class="" style="display: flex;margin-top: 30rpx;">
					<view @click="quxiao3" style="margin-right:20rpx;flex:1;height: 80rpx;line-height: 80rpx;background-color: #C0C0C0;border-radius: 40rpx;color: #FFFFFF;font-size: 30rpx;text-align: center;">
						取消
					</view>
					<view @click="guanbi3" style="flex:1;height: 80rpx;line-height: 80rpx;background-color: #1fb0ac;border-radius: 40rpx;color: #FFFFFF;font-size: 30rpx;text-align: center;">
						确定
					</view>
				</view>
			</view>
		</uni-popup>
    <noLoginToast ref="noLoginToast" />
		<!-- <kongye v-if="kk"></kongye> -->
	</view>
</template>

<script>
	import isAuditIos from '@/common/isAuditIos.js'
	// import kongye from '@/components/kong-ye.vue'
	export default {
		mixins: [isAuditIos],
		data(){
			return{
				background:{ background: 'linear-gradient(180deg, #0078FF 0%, #1fb0ac 100%)' },
				tabIndex:0,
				scrollInto:'',
				sheng_list:[
					{
						id:'0',
						name:'全部'
					}
				],
				ti_list:[],
				id:0,
				page: 1,
				kk:false,
				enmpy: false,
				list:[],
				type:'center',
				da:false,
				is_vip:0,

				zf1_list:['开通会员','单次付费'],
				ff_status:1,
				xz:'https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/54.png',
				wxz:'https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/53.png',

				xz1:'https://qiniuoss.yjqwl.cn/uploads/20211202/FkN30x9LjjabUbw1KCzyNsS7NGgl.png',
				wxz1:'https://qiniuoss.yjqwl.cn/uploads/20211202/FkioTkXoDKWrGBKGu_RJPpzkFcPm.png',
				zf_list:['微信支付','积分支付'],
				zf_status:1,
				xq_id:'',
				listqian:[],
				dancifu:{},
				pingguo_xian:false,
			}
		},
		onPageScroll(t) {
			t.scrollTop > 80 ? this.da = true : this.da = false;
		},
		onLoad(option) {
			this.tabIndex=option.index
			// this.scrollInto=option.ids
			this.hq_fl()

			this.yang()
			this.pingguo()
			// this.qian()
		},
		onPullDownRefresh() {
		      this.page= 1
		      this.kk=false
		      this.enmpy= false
		      this.list=[]
		      this.hq_list()
			  // this.hq_fl()
			  this.yang()
		       setTimeout(function () {
		           uni.stopPullDownRefresh();
		       }, 2000);
		  },
		onShow() {
			// this.hq_fl()

			this.user_xx()
		},
		onReachBottom: function() {
			if (this.enmpy) {
				return
			} else {
				this.hq_list()
			}
		},
		methods:{
			// 配置
			qian:function(){
				this.post('api/vip/lists','',true).then(res=>{
					console.log(res)
					if(res.code==1){
						this.listqian=res.data
					}
				})
			},
			// 增加访问量
			yang:function(){
				this.post('api/homepage/pageviews',{path:'/pages/shouye/hangqing'},true).then(res=>{
					console.log(res)
				})
			},
			ff:function(index){
				this.ff_status=index+1
			},
			user_xx:function(){
				this.post('api/user/info','',true).then(res=>{
					console.log(res)
					if(res.code==1){
						this.is_vip=res.data.is_vip
					}
				})
			},
			quxiao2:function(){
				his.$refs.popup2.close()
			},
			guanbi2:function(){
				this.$refs.popup2.close()
				if(this.ff_status==1){
					if (this.iosUpAppStore) {
						uni.navigateTo({
							url:'/subpages/pages/vip'
						})
					}
				}else{
					this.$refs.popup3.open()
				}
			},
			zffs:function(index){
				this.zf_status=index+1
			},
			quxiao3:function(){
				this.$refs.popup3.close()
			},
			guanbi3:function(){
				let that=this
				this.$refs.popup3.close()
				this.post('api/news/read_news',{news_id:this.xq_id,trade_type:this.zf_status},true).then(res=>{
					console.log(res)
					if(res.code==1){
						if(this.zf_status==1){
							uni.getSystemInfo({
							    success: function (res) {
									let str = res.model
									console.log(str.indexOf("iPhone") != -1); // true
									that.post('api/index/wechat_check','',true).then(re=>{
										if(str.indexOf("iPhone") != -1){
											if(re.data==1){
												that.fukuan()
											}else{
												uni.showModal({
												    title: '温馨提示',
												    content: '由于相关规范，ios功能暂不可用！',
												    success: function (res) {
												        if (res.confirm) {

												        } else if (res.cancel) {

												        }
												    }
												});

											}
										}else{
											that.fukuan()
										}
									})

							    }
							});
						}else{
							uni.showToast({
								title: res.msg,
								icon: "none",
								duration: 1000
							})
							console.log(111111111)
							setTimeout(function(){
								uni.navigateTo({
									url:'zxxq?id='+that.xq_id
								})
							},1500)
						}
					}else{
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 1000
						})
					}
				})
			},
			pingguo:function(){
				let that=this
				uni.getSystemInfo({
					    success: function (res) {
							let str = res.model
							console.log(str.indexOf("iPhone") != -1); // true
							that.post('api/index/wechat_check','',true).then(re=>{
								if(re.data==1){
									that.pingguo_xian=true
								}else{
									that.pingguo_xian=false
								}
								// if(str.indexOf("iPhone") != -1){
								// 	if(re.data==1){
								// 		that.pingguo_xian=true
								// 	}else{
								// 		that.pingguo_xian=false
								// 	}
								// }else{
								// 	that.pingguo_xian=true
								// }
							})

					    }
					});
			},
			fukuan:function(){
				let that=this
				uni.requestPayment({
				    provider: 'wxpay',
				    timeStamp: res.data.pay.timeStamp,
				    nonceStr: res.data.pay.nonceStr,
				    package: res.data.pay.package,
				    signType: res.data.pay.signType,
				    paySign: res.data.pay.paySign,
				    success: function (res) {
				      uni.showToast({
				      	title: '支付成功',
				      	icon: "none",
				      	duration: 1000
				      })
					  setTimeout(function(){
					  		uni.navigateTo({
					  			url:'zxxq?id='+that.xq_id
					  		})
					  },1500)
				    },
				    fail: function (err) {
				        console.log('fail:' + JSON.stringify(err));
				    }
				});
			},

			// 滚动到顶部
			gundong:function(){
				uni.pageScrollTo({
					scrollTop:0
				})
			},
			ontabtap:function(index,id){
				this.page= 1
				this.kk=false
				this.enmpy= false
				this.list=[]
				this.tabIndex=index
				this.id=id
				this.scrollInto = this.ti_list[index].ids;
				uni.setNavigationBarTitle({
					title: this.ti_list[this.tabIndex].title
				});
				console.log(this.scrollInto)
				this.hq_list()
			},
			back:function(){
				uni.navigateBack({
					delta:1
				})
			},
			// 行情资讯获取分类
			hq_fl:function(){
				let that=this
				this.post('api/information/category','',true).then(res=>{
					console.log(res)
					return
					if(res.code==1){
						this.ti_list=res.data
						for(let i=0;i<this.ti_list.length;i++){
							this.ti_list[i]['ids']='a'+i
						}
						this.id=this.ti_list[this.tabIndex].id
						this.scrollInto=this.ti_list[this.tabIndex].ids
						uni.setNavigationBarTitle({
							title: that.ti_list[this.tabIndex].title
						});
						this.page= 1
						this.kk=false
						this.enmpy= false
						this.list=[]
						this.hq_list()
					}
				})
			},
			// 获取列表
			hq_list:function(){
				let data={
					page:this.page,
					category_id:this.id,
					limit:10
				}
				this.post('api/information',data,true).then(res=>{
					console.log(res,123456)
					if(res.code==1){
						if(this.page==1){
							if (res.data.data== null || res.data.data.length == 0) {
								this.kk = true
								this.enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.enmpy = true
							}
						}else{
							if (res.data.data== null || res.data.data.length == 0) {
								this.enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.enmpy = true
							}
						}

						this.page++
						this.list.push(...res.data.data)
					}else{
						this.kk = true
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 1000
						})
					}
				})
			},
			quxiao1: function() {
				this.$refs.popup1.close()
			},
			login1: function(e) {
				console.log(e)
				let that = this
				this.$refs.popup1.close()
				uni.login({
					provider: 'weixin',
					success: (code) => {
						console.log(code)
						this.post('api/wechat/phone', {
							code: code.code,
							iv: e.detail.iv,
							encryptedData: e.detail.encryptedData
						}, true).then(res => {
							console.log(res, '123455')
							if (res.code == 1) {
								uni.setStorageSync('mobile', res.data.phoneNumber)
								uni.setStorageSync('mobile2',res.data.mobile2)
							}else{
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 1000
								})
							}

						})

					}
				})
			},
			async xq(id){
				// uni.navigateTo({
				// 	url:'zxxq?id='+id
				// })
				// return
				let that=this
				this.xq_id=id
				console.log(vip)
				let isLogin = await this.$refs.noLoginToast.open()
				if (isLogin) {
					let isHasMobile = await this.$refs.noLoginToast.getPhoneNumber()
					if (!isHasMobile) {
						return
					}
				} else {
					return
				}
				if(vip==1){
					uni.navigateTo({
						url:'zxxq?id='+id
					})
				}else{
					if(pay==1 || this.is_vip==1){
						uni.navigateTo({
							url:'zxxq?id='+id
						})
					}else if(this.is_vip!=1 || pay!=1){
						that.post('api/news/read_news_info',{news_id:id},true).then(res=>{
							console.log(res,123456566666)
							if(res.code==1){
								that.dancifu=res.data
								if(that.pingguo_xian){
									if (this.iosUpAppStore) {
										that.$refs.popup2.open()
									} else {
										uni.navigateTo({
											url:'zxxq?id='+id
										})
									}
								}else{

								}
							}
						})
					}
				}
			}
		},
		filters: {
			getLocalTime(fmt) {
				console.log(fmt);
				function PrefixZero(num, n) {
					return (Array(n).join(0) + num).slice(-n);
				}
				var time = '';
				var date = new Date(fmt * 1000);
				var Y = date.getFullYear();
				var M = date.getMonth() + 1;
				var D = date.getDate();
				var h = PrefixZero(date.getHours(), 2);
				var m = PrefixZero(date.getMinutes(), 2);

				var s = PrefixZero(date.getSeconds(), 2);
				time = Y + '-' + M + '-' + D ;
				return time;
			}
		},
	}
</script>

<style lang="scss">
	page{
		background-color: #F5F5F5;
		font-family: Demibold;
	}
	.footer {
		display: flex;
		justify-content: space-between;
		border-top: 1px solid #f4f4f4;
		margin-top: 30rpx;
		padding-bottom: 20rpx;

		button {
			margin: 0 auto;
			width: 100%;
			background-color: #19BE6B;
			// width: 200upx;
			border-radius: 10upx;
			font-size: $uni-font-size-sm;
			// padding: 22upx 34upx;
			height: 80upx;
			font-size: 30rpx;
			line-height: 80upx !important;
			// line-height: 1;
			color: #FFFFFF;
		}

		button:after {
			border: 0;
		}
	}

	button:after {
		border: 0;
	}
	.slot-wrap {
			display: flex;
			align-items: center;
			/* 如果您想让slot内容占满整个导航栏的宽度 */
			/* flex: 1; */
			/* 如果您想让slot内容与导航栏左右有空隙 */
			padding: 0 30rpx;
		}
		.scroll-h {
		    width: 100%;
		    height: 80rpx;
			line-height: 80rpx;
		    flex-direction: row;
		    /* #ifndef APP-PLUS */
		    white-space: nowrap;
		    /* #endif */
		    /* flex-wrap: nowrap; */
		    /* border-color: #cccccc;
			border-bottom-style: solid;
			border-bottom-width: 1px; */
		}

		.uni-tab-item {
		    /* #ifndef APP-PLUS */
		    display: inline-block;
		    /* #endif */
		    flex-wrap: nowrap;
			/* float: left; */
		    padding-left: 30rpx;
		    padding-right: 30rpx;
			position: relative;
			 display: inline-block;
		}
		.uni-tab-item:after{

		}
		.uni-tab-item:first-child:after{
			background: none;
		}
		.uni-tab-item-title {
		    height: 80rpx;
		    line-height: 80rpx;
		    flex-wrap: nowrap;
			font-size: 30rpx;
			color: rgba(255,255,255,.7);
		    /* #ifndef APP-PLUS */
		    white-space: nowrap;
		    /* #endif */
		}

		.uni-tab-item-title-active {
		    font-weight: 600;
		    font-size: 30rpx;
			color: #ffffff;
		}
</style>
